// mycomponent/temp/qrcode/qrcode.js
var posterBehavior = require("../../../plamPoster/plamPoster.js");
var app = getApp();

Component({
  behaviors: [posterBehavior],
  /**
   * 组件的属性列表
   */
  properties: {
    goodsId: {
      type: null,
      optionalTypes:[String,Number]
    },
    // 拼团后端生成海报
    ispt: {
      type: null,
    },
    activityid: {
      type: null
    },
    store_id: {
      type: null
    },
    posterUrl: {
      type: String,
      value: 'plugin.company-manage.frontend.store.zhangLv.getPromoteInfo'//默认商城海报接口，如需提供插件接口，父组件传递poster-url
    },
  },

  /**
   * 组件的初始数据
   */
  data: {
    posterData: null
  },
  ready() {
    //	this.getPosterPic();
  },
  observers: {
    isshow: function (isshow) {
      if (isshow) {
        console.log(345345345)
        this.data.getFlag = false;
        this.setData({ poster: "", loading: 0 });
        this.getPosterPic();
      }
    }
  },
  /**
   * 组件的方法列表
   */
  methods: {
    getUserInfo(){
      let urlStr = app.getNetAddresss("plugin.company-manage.frontend.store.zhangLv.get");
      app._getNetWork({
        url: urlStr,
        data: '',
        success: (resdata) => {
          console.log(resdata,'-----------resdata')
          if (resdata.data.result == 1) {
            let res = resdata.data.data;
            this.data.posterData['avatar'] = res.avatar
            this.data.posterData['userName'] = res.name
            this.data.posterData['shareTitle'] = '邀你成为掌上旅行者'
            this.setData({
              posterData:this.data.posterData
            })
            this.startOldDrawCanvas(this.data.posterSize, this.data.posterData);
          }
        }
      })
    },
    async getPosterPic() {
      let posterWidth = wx.getSystemInfoSync().windowWidth*0.83*2;
      let posterHeight = posterWidth * 1.37
      let posterSize = await this.getMyCanvasMessage(posterWidth, posterHeight);
      this.setData({
        canvasWidth: posterSize.width,
        canvasHeight: posterSize.height,
      });
      this.setData({
        posterSize: posterSize
      });
      var urlStr = app.getNetAddresss(this.properties.posterUrl);
      console.log('调用的就是我')
      app._getNetWork({
        showToastIn: false,
        url: urlStr,
        data: '',
        success: (resdata) => {
          let res = resdata.data;
          if (res.result != 1) {
            wx.showToast({
              title: res.msg,
            });
            return;
          }
          this.setData({
            posterData:res.data
          })
          this.getUserInfo()
        },
        complete: () => {
          this.data.getFlag = true;
        },
      });
    },

    // async startDrawCanvas(posterSize, posterData) {
    //   let getMarketPrice = "原价";
    //   let getPrice = "现价";
    //   try {
    //     wx.getStorage({
    //       key: "yz_basic_info",
    //       success: function (res) {
    //         if (res.data.lang.goods.market_price != "") {
    //           getMarketPrice = res.data.lang.goods.market_price;
    //         }
    //         if (res.data.lang.goods.price != "") {
    //           getPrice = res.data.lang.goods.price;
    //         }
    //       },
    //     });
    //   } catch (e) {
    //     console.log(e);
    //   }
    //   console.log("haobao")
    //   const ctx = wx.createCanvasContext("myCanvas", this);
    //   ctx.save();
    //   this.drawRoundRectPath(ctx, posterSize.width, posterSize.height, 30);
    //   ctx.setFillStyle("#fff");
    //   ctx.fillRect(0, 0, posterSize.width, posterSize.height);
    //   //console.log(posterData.background)
    //   //绘制背景
    //   if (posterData.background.type == "background") {
    //   //  let bgImg = await this.readDownPicInfo(posterData.background.src);
    //     let bgImg = await this.downImage({src:posterData.background.src});
    //     //绘制背景图片
    //     this.setProportion(posterSize, bgImg);

    //     this.drawCanvasImage(ctx, {
    //       left: 0,
    //       top: 0,
    //       width: bgImg.width / this.data.step,
    //       height: bgImg.height / this.data.step,
    //       img: bgImg.img,
    //     });
    //   } else if (posterData.background.type == "color") {
    //     this.drawCanvasFillRect(ctx, {
    //       width: posterSize.width / this.data.step,
    //       color: posterData.background.src,
    //       height: posterSize.height / this.data.step,
    //       top: 0,
    //       left: 0,
    //     });
    //   }
    //   this.setData({ loading: 10 });
    //   //ctx.restore();
    //   for (let i = 0; i < posterData.poster_data.length; i++) {
    //     let item = posterData.poster_data[i];
    //     if (item.type == "logo" || item.type == "img" || item.type == "other_img" || item.type == "head" || item.type == "qr") {
    //       if (item.src) {
    //         let file = await this.downImage(item);
    //         item.img = file.img;
    //         this.drawCanvasImage(ctx, item);
    //       }
    //     } else if (item.type == "title" || item.type == "nickname") {
    //       let line = Math.floor(item.height / (item.size + 10)) || 1;
    //       item.line = line;
    //       this.drawCanvasLineText(ctx, item);
    //     } else if (item.type == "invite" || item.type == "text" || item.type == "mid") {
    //       this.drawCanvasText(ctx, item);
    //     } else if (item.type == "price") {
    //       item.src = getPrice + ":￥" + item.src;
    //       this.drawCanvasText(ctx, item);
    //     } else if (item.type == "member_price") {
    //       item.src = "会员价:￥" + item.src;
    //       this.drawCanvasText(ctx, item);
    //     } else if (item.type == "market_price" && item.src != 0 && item.src != "0.00") {
    //       item.src = getMarketPrice + ":￥" + item.src;
    //       this.drawCanvasText(ctx, item);
    //     }
    //     let loading = parseInt((75 / posterData.poster_data.length) * (i + 1));
    //     this.setData({ loading: loading + 10 });
    //   }
    //   let loadingTime = setInterval(() => {
    //     let loading = this.data.loading + 2;
    //     loading = loading >= 100 ? 100 : loading;
    //     this.setData({ loading });
    //     if (loading >= 100) clearInterval(loadingTime);
    //   }, 2000);
    //   ctx.draw(
    //     false,
    //     setTimeout(async () => {
    //       let img = await this.toimage("myCanvas", posterSize);
    //       clearInterval(loadingTime);
    //       let target = "listData[162]";
    //       this.setData({
    //         loading: 100,
    //         poster: img,
    //         [target]: img,
    //       });
    //       this.removeUnsafeList();
    //     }, 300)
    //   );
    // },
    //开始绘制-兼容旧海报
    async startOldDrawCanvas(posterSize, posterData) {
      const ctx = wx.createCanvasContext("myCanvas", this);
      ctx.save();
      this.drawRoundRectPath(ctx, posterSize.width, posterSize.height, 30);
      ctx.setFillStyle("#fff");
      ctx.fillRect(0, 0, posterSize.width, posterSize.height);
      //ctx.draw();
      //ctx.restore();
      //绘制banner大图
      if (posterData.cover_url.length!=0 && posterData.cover_url[0]) {
        let file2 = await this.downImage({ src: posterData.cover_url[0], width: this.data.canvasWidth, height: this.data.canvasWidth });
        this.drawCanvasImage(ctx, {
          img: file2.img,
          top: 0,
          left: 0,
          width: this.data.canvasWidth,
          height: this.data.canvasWidth,
        });
      }
      this.setData({ loading: 50 });
      //绘制头像
      if (posterData.avatar) {
        let file2 = await this.downImage({ src: posterData.avatar, width: this.data.canvasWidth*0.18, height: this.data.canvasWidth*0.18 });
        this.drawCanvasImage(ctx, {
          img: file2.img,
          top: this.data.canvasHeight*0.776,
          left: this.data.canvasWidth*0.058,
          width: this.data.canvasWidth*0.18,
          height: this.data.canvasWidth*0.18
        });
        let file3 = await this.downImage({ src: app.data.host+'static/images/circular2.png', width: this.data.canvasWidth*0.196, height: this.data.canvasWidth*0.196 });
        this.drawCanvasImage(ctx, {
          img: file3.img,
          top: this.data.canvasHeight*0.77,
          left: this.data.canvasWidth*0.049,
          width: this.data.canvasWidth*0.196,
          height: this.data.canvasWidth*0.196
        });
      }
      this.setData({ loading: 60 });

      //绘制用户昵称
      if (posterData.userName) {
        this.drawCanvasLineText(ctx, {
          top: this.data.canvasHeight*0.822,
          left: this.data.canvasWidth*0.245,
          src: posterData.userName,
          size: 28,
          color: "#3C3C3C",
          width: this.data.canvasWidth*0.347,
          line: 2,
        });
      }
      this.setData({ loading: 65 });
      //绘制邀请语
      if (posterData.shareTitle) {
        this.drawCanvasLineText(ctx, {
          top: this.data.canvasHeight*0.921,
          left: this.data.canvasWidth*0.074,
          src: '邀你成为掌上旅行社',
          size: 32,
          color: "#3C3C3C",
          width: this.data.canvasWidth*0.524,
          line: 1,
        });
      }

      this.setData({ loading: 70 });
      
      //绘制二维码
      if (posterData.qr_code_url) {
        let file2 = await this.downImage({ src: app.data.host+'static/images/QRcode-bg.png', width: this.data.canvasWidth*0.26, height: this.data.canvasWidth*0.26 });
        console.log(app.data.host+'static/images/QRcode-bg.png')
        this.drawCanvasImage(ctx, {
          img: file2.img,
          top: this.data.canvasHeight*0.772,
          left: this.data.canvasWidth*0.63,
          width: this.data.canvasWidth*0.26,
          height: this.data.canvasWidth*0.26
        });
        let file3 = await this.downImage({ src: posterData.qr_code_url, width: this.data.canvasWidth*0.2347, height: this.data.canvasWidth*0.2347 });
        this.drawCanvasImage(ctx, {
          img: file3.img,
          top: this.data.canvasHeight*0.781,
          left: this.data.canvasWidth*0.643,
          width: this.data.canvasWidth*0.2347,
          height: this.data.canvasWidth*0.2347
        });
      }
      this.setData({ loading: 75 });

      let loadingTime = setInterval(() => {
        let loading = this.data.loading + 2;
        loading = loading >= 100 ? 100 : loading;
        this.setData({ loading });
        if (loading >= 100) clearInterval(loadingTime);
      }, 2000);
      ctx.draw(
        false,
        setTimeout(async () => {
          let img = await this.toimage("myCanvas", posterSize);
          clearInterval(loadingTime);
          this.setData({
            loading: 100,
            poster: img
          });
          this.removeUnsafeList();
        }, 300)
      );
    },
  },
});
